<template>
	<view class="warp">
		<uni-segmented-control :current="current" :values="localSeg" @clickItem="segClick"
			styleType="text"></uni-segmented-control>
		<WolfHeader :sort-data="sortData"></WolfHeader>
		<uni-list>
			<uni-list-item v-for="(item,index) in dataList" :key="item.userInfo?._id" @click="navigator(item.userInfo?._id)" clickable>
				<template v-slot:body>
					<view class="list">
						<view class="list-sort">{{item.sort}}</view>
						<image :src="item.userInfo?.avatar_file?.url || '../../static/logo.png'" mode="aspectFill"
							class="list-image"></image>
						<view class="list-body">
							<view class="list-body-userInfo">
								<view class="list-body-userInfo-name">{{item.userInfo?.nickname || '匿名'}}</view>
								<view class="list-body-userInfo-days">{{(item.giftprice/10) || 0}} 福币</view>
							</view>
						</view>
					</view>
				</template>
			</uni-list-item>
		</uni-list>
	</view>
</template>

<script>
	import WolfHeader from "./components/header.vue"
	import {
		mapState,
		mapActions
	} from 'pinia'
	import {
		useUserStore
	} from "@/pinia/user.js"
	
	const db = uniCloud.database();

	export default {
		name: "wolf-gift",
		components: {
			WolfHeader
		},
		data() {
			return {
				dataList: [],
				sortData: {

				},
				current: 0,
				localSeg: [ "印象榜",'财富榜']
			}
		},
		computed: {
			...mapState(useUserStore, ['userInfo', 'sysSetting']),
			showWeekFirstDay() {//每周一0点时间戳
				var nowTemp = new Date(); //当前时间
				var oneDayLong = 24*60*60 * 1000; //一天的毫秒数
				var c_time = nowTemp.getTime(); //当前时间的毫秒时间
				var c_day = nowTemp.getDay() || 7; //当前时间的星期几
				var m_time = c_time - (c_day - 1) * oneDayLong; //当前周一的毫秒时间
				return new Date(m_time).setHours(0,0,0,0)
			},
			showMonthFirstDay(){
				var nowTemp = new Date(); //当前时间
				nowTemp.setDate(1)
				return nowTemp.setHours(0,0,0,0)
			}
		},
		onLoad() {
			this.loadData()
			// console.log("=======>>",this.showWeekFirstDay,new Date(this.showWeekFirstDay).toLocaleString());
		},
		methods: {
			async loadData() {//从每周一0点开始计算
				console.log("this.showWeekFirstDay======>",this.showWeekFirstDay);
				console.log("this.showMonthFirstDay======>",this.showMonthFirstDay,this.sysSetting.gift_short);
				// let a = await db.collection('wolf-gift-log').where(`create_time > ${this.showWeekFirstDay}`).get()
				// console.log("a=====>",a);
				let where = {}
				if(this.sysSetting.gift_short===1){
					where = `create_time > ${this.showMonthFirstDay}`
				}
				if(this.sysSetting.gift_short===2){
					where = `create_time > ${this.showWeekFirstDay}`
				}
				let giftRes = db.collection('wolf-gift-log').where(where).getTemp()
				let userRes = db.collection('uni-id-users').field('nickname,avatar_file,_id').getTemp()
				let groudby = 'pid'
				if (this.current) {
					groudby = "uid"
				}
				let res = await db.collection(giftRes, userRes).groupBy(groudby).groupField("sum(price) as giftprice")
					.orderBy('giftprice desc').limit(100).get()
				console.log("res===>", res);
				let data = res.result.data || []
				let len = Math.min(data.length, 3)
				this.sortData = {}
				
				let arr = ["first", "second", "third"]
				for (let i = 0; i < data.length; i++) {
					let sort = i + 1
					data[i].sort = sort + ''
					data[i].userInfo = data[i][groudby][0]
					if (i < len) {
						this.sortData[arr[i]] = data[i]
					}
				}
				data.splice(0, len)
				this.dataList = [...data]
				console.log("&&&&&&&&&&&==========", this.sortData, data);
			},
			segClick(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex
					this.loadData()
				}
			},
			navigator(id){
				console.log("id==>",id);
				if(!id) return
				uni.navigateTo({
					url:`/pages/list/userInfo?id=${id}`
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	view {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
	}

	.bottom {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		height: 50px;
	}

	//list-body-level
	.list {
		flex: 1;
		flex-direction: row;
		align-items: center;

		&-sort {
			justify-content: center;
			align-items: center;
			// padding: 10rpx;
			margin-right: 10rpx;
			border-radius: 50rpx;
			background-color: #ea6cf5;
			width: 80rpx;
		}

		&-image {
			width: 80rpx;
			height: 80rpx;
			border-radius: 40rpx;
		}

		&-body {
			flex: 1;
			flex-direction: row;
			font-size: 12px;
			justify-content: space-around;

			&-userInfo {
				flex: 1;
				padding: 0 10rpx;

				&-name {}

				&-days {}

			}

			&-date {
				padding: 0 10rpx;

				&-start-day,
				&-current-day {
					flex-direction: row;
				}
			}

			&-level {
				padding: 0 10rpx;
				align-items: center;
				justify-content: center;
				background-color: #bfe6ff;
				border-radius: 5rpx;
			}
		}
	}
</style>